<template>
    <div class="ali-pay">
        
        <order-header title="支付宝支付">
            <template v-slot:tip>
                <span>请谨防钓鱼链接或诈骗电话，了解更多</span>
            </template>
        </order-header>
        <loading v-if="loading"></loading>
        <div class="form" v-html="content"></div>
    </div>
</template>

<script>
import Loading from '@/components/Loading.vue';
import OrderHeader from '@/components/OrderHeader.vue';
    export default {
        name: 'nong-alipay',
        components: {
            OrderHeader, Loading
        },
        data() {
            return {
                orderId: this.$route.query.orderId,
                content: '',
                loading: true,
            };
        },
        mounted() {
            this.paySubmit()
        },
        methods: {
            paySubmit() {
                this.request.post('/ali-pay/trade/page/pay/' + this.orderId).then((res) => {
                    this.content = res
                    setTimeout(() => {
                        //设置延时器，并触发form表单中的跳转支付宝页面方法
                        document.forms[0].submit()
                    }, 500)
                })
            }
        }
    }
</script>